<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<script src="../../../static/js/mui.min.js"></script>
		<link href="../../../static/css/mui.min.css" rel="stylesheet" />
		<link href="../../../static/css/register.css" rel="stylesheet" />
	</head>

	<body>
		<header class="mui-bar mui-bar-nav" style="height: 59px;background: #E3DDD4;">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" style="margin-top: 24px;color: #000000;"></a>
			
		    <h1 class="mui-title" style="margin-top: 26px;">注册</h1>
		</header>
		<div style="text-align: center;margin-top: 18%;">
			<div style="width: 100%;height:61px;background-color: #FFFFFF;" >
			   <div class="mui-title" style="height:61px;text-align: left;margin:10px 16px;">选择头像</div>
			   <div style="position: absolute;left: 80%;">
				   <input type="file" id="uploadImg" accept="images/*" capture="camera" style="position: absolute;width: 61px;height: 61px;opacity: 0;"/>
				   <img id="head_img" src="../../../static/imgs/my/head.png" style="width: 61px;height: 61px;margin-right: 16px;">
			   </div>
		  </div>  
		<div class="text" style="margin-top: 17px;">
			<input id="nickname" type="text" placeholder="昵称" style="width: 344px;height: 42px;margin-top: 0px;"/>
			<input id="motto" type="text" placeholder="个人简介" style="width: 344px;height: 42px;"/>
		</div>
		<div style="width: 100%;background-color: #FFFFFF;" >
			<input type="image" onclick="register2()" src="../../../static/imgs/rigister.png" style="width: 312px;height: 76px;margin-left: 35px;" />
		</div>
		
		<!-- JQUERY -->
		<script src="../../../static/js/jquery-2.0.3.min.js"></script>
		<!--<script src="../../../static/js/jquery.backstretch.min.js"></script>
		<script src="../../../static/js/jquery.cookie.js"></script>-->
		<!-- BOOTSTRAP -->
		<script src="../../../static/js/bootstrap.min.js"></script>
		
		<script src="../../../static/js/md5.js"></script>
		
		<script type="text/javascript">
			var imgURL;
			function register2(){
				var message = "";
				var nickname = document.getElementById("nickname");
				var motto = document.getElementById("motto");
				var formData = new FormData();
				formData.append("file",$("#uploadImg")[0].files[0]);
				formData.append("nickname",nickname.value);
				formData.append("motto",motto.value);
				
				if(nickname.value == null || motto.value == "") {
							message += "昵称不能为空！\n";
						} 
						if(motto.value == null || motto.value == "") {
							message += "个性签名不能为空！\n"
						}
						if(message != "") {
							mui.toast(message);
						} else {
							$.ajax({
								type: "post",
								url: "../../phone/user/register2",
//								cache: false,
								async: true,
								processData:false,
							    contentType:false,
								data: formData,
								success: function(data) {
//									alert(data);
									if(data == "1") {
										window.location.href = "../../phone/index/index";
									} else if(data == "2") {
										mui.toast('该昵称已被占用!');
									}else if(data == "3"){
										mui.toast('请返回上一步重新输入!');
									}else if(data == "4"){
										mui.toast('图片上传失败!');
									}else {
										mui.toast('出现了未知的错误！');
									}
								},
								error: function() {
									mui.toast('服务器出错了!');
								}
							});
						}
			}
			
			
			
			$("#uploadImg").change(function() {
		        var file = $(this);
		        var fileObj = file[0];
		        var windowURL = window.URL || window.webkitURL;
		        var dataURL;
		        for (var i = 0; fileObj && fileObj.files && fileObj.files[i]; i++) {
		            dataURL = windowURL.createObjectURL(fileObj.files[i]);
		            $("#head_img").attr('src', dataURL);
		            imgURL = dataURL;
		        }
		    });


			
		</script>
		
	</body>
</html>
